<template>
	<view class="">
		<cu-custom bgColor="bg-gradual-orange" :isBack="true">
			<block slot="content">商家进件</block>
		</cu-custom>
		<view class="apply-view" v-if="form.sub_mchid == null">
			<view>
				<view class="info">
					<view v-if="form.error">
						<view v-for="(item,index) in form.error.audit_detail">
							{{item.reject_reason}}
						</view>
					</view>
					拒绝原因:{{form.state_msg}}
				</view>
			</view>


			<form @submit="formSubmit">
				<block>
					<!-- 主体资料 -->
					<uni-section title="主体资料" type="line"></uni-section>
					<!-- <view class="uni-form-item" v-if="uid == 0">
					<view class="title">商户uid</view>
					<input class="uni-input" v-model="form.uid" placeholder="请输入商户uid" />
				</view> -->
					<view class="uni-form-item">
						<view class="title">主体类型</view>
						<picker @change="pickerChange($event,'subject_type')" :value="subject_type_index"
							:range="subject_type" range-key="name">
							<view class="uni-input">{{subject_type[subject_type_index].name}}</view>
						</picker>
					</view>
					<view class="uni-form-item">
						<view class="title">营业执照照片</view>
						<view class="form-item">
							<view class="item">
								<text class="item-add" @click="ChooseImage('license_copy')"
									v-if="!form.license_copy">+</text>
								<image class="img" :src="form.license_copy_url" mode="aspectFill"
									@tap="ViewImage('license_copy')" v-if="form.license_copy"></image>
								<text class="delete-btn" @click="DeleteImage('license_copy')"
									v-if="form.license_copy">X</text>
								<text class='label' style="height: 10px;"></text>
							</view>
						</view>
					</view>
					<view class="uni-form-item">
						<view class="title">注册号/统一社会信用代码</view>
						<input class="uni-input" v-model="form.license_number" placeholder="请输入注册号/统一社会信用代码" />
					</view>
					<view class="uni-form-item">
						<view class="title">商户名称</view>
						<input class="uni-input" v-model="form.merchant_name" placeholder="请输入营业执照全称" />
					</view>
					<view class="uni-form-item">
						<view class="title">个体户经营者/法人姓名</view>
						<input class="uni-input" v-model="form.legal_person" placeholder="请输入个体户经营者/法人姓名" />
					</view>
					<!-- 组织机构代码证 -->
					<!-- <uni-section title="组织机构代码证" type="line"></uni-section>
				<view class="uni-form-item">
					<view class="title">组织机构代码证照片</view>
					<view class="form-item">
						<view class="item">
							<text class="item-add" @click="ChooseImage('organization_copy')" v-if="!form.organization_copy">+</text>
							<image class="img" :src="form.organization_copy_url" mode="aspectFill"  @tap="ViewImage('organization_copy')" v-if="form.organization_copy"></image>
							<text class='label' style="height: 10px;"></text>
						</view>
					</view>
				</view>
				<view class="uni-form-item">
					<view class="title">组织机构代码</view>
					<input class="uni-input" v-model="form.organization_code" placeholder="请输入组织机构代码" />
				</view>
				<view class="uni-form-item">
					<view class="title">组织机构代码证有效期开始日期</view>
					<input class="uni-input" v-model="form.org_period_begin" placeholder="填写格式：2019-08-01" />
				</view>
				<view class="uni-form-item">
					<view class="title">组织机构代码证有效期结束日期</view>
					<input class="uni-input" v-model="form.org_period_end" placeholder="填写格式：2029-08-01或长期" />
				</view> -->
					<!-- 经营者/法人身份证件 -->
					<uni-section title="经营者/法人身份证件" type="line"></uni-section>
					<view class="uni-form-item">
						<view class="title">经营者/法人身份证人像面照片</view>
						<view class="form-item">
							<view class="item">
								<text class="item-add" @click="ChooseImage('id_card_copy')"
									v-if="!form.id_card_copy">+</text>
								<image class="img" :src="form.id_card_copy_url" mode="aspectFill"
									@tap="ViewImage('id_card_copy')" v-if="form.id_card_copy"></image>
								<text class="delete-btn" @click="DeleteImage('id_card_copy')"
									v-if="form.id_card_copy">X</text>

								<text class='label' style="height: 10px;"></text>
							</view>
						</view>
					</view>
					<view class="uni-form-item">
						<view class="title">经营者/法人身份证国徽面照片</view>
						<view class="form-item">
							<view class="item">
								<text class="item-add" @click="ChooseImage('id_card_national')"
									v-if="!form.id_card_national">+</text>
								<image class="img" :src="form.id_card_national_url" mode="aspectFill"
									@tap="ViewImage('id_card_national')" v-if="form.id_card_national"></image>
								<text class="delete-btn" @click="DeleteImage('id_card_national')"
									v-if="form.id_card_national">X</text>

								<text class='label' style="height: 10px;"></text>
							</view>
						</view>
					</view>
					<view class="uni-form-item">
						<view class="title">经营者/法人身份证姓名</view>
						<input class="uni-input" v-model="form.id_card_name" placeholder="请输入经营者/法人身份证姓名" />
					</view>
					<view class="uni-form-item">
						<view class="title">经营者/法人身份证号码</view>
						<!-- {{form}} -->
						<input class="uni-input" v-model="form.id_card_number" placeholder="请输入经营者/法人身份证号码" />
					</view>
					<view class="uni-form-item" v-if="form.subject_type == 'SUBJECT_TYPE_ENTERPRISE'">
						<view class="title">经营者/法人身份证居住地址</view>
						<input class="uni-input" v-model="form.id_card_address" placeholder="填写格式:广东省深圳市南山区xx路xx号xx室" />
					</view>
					<view class="uni-form-item">
						<!-- {{form.card_period_begin}} -->
						<view class="title">身份证有效期开始时间(填写格式：2036-06-06)</view>
						<input class="uni-input" @input="checkcard_begin()" v-model="form.card_period_begin"
							placeholder="填写格式：2036-06-06" />
						<view v-if="error.card_period_begin" style="color: red;">{{error.card_period_begin}}</view>
					</view>
					<view class="uni-form-item">
						<view class="title">身份证有效期结束时间(填写格式：2036-06-06或长期)</view>
						<input class="uni-input" @input="checkcard_end()" v-model="form.card_period_end"
							placeholder="填写格式：2036-06-06或长期" />
						<view v-if="error.card_period_end" style="color: red;">{{error.card_period_end}}</view>
					</view>
					<!-- 经营资料 -->
					<uni-section title="经营资料" type="line"></uni-section>
					<view class="uni-form-item">
						<view class="title">商户简称</view>
						<input class="uni-input" v-model="form.merchant_shortname" placeholder="填写格式：张三餐饮店" />
					</view>
					<view class="uni-form-item">
						<view class="title">客服电话</view>
						<input class="uni-input" v-model="form.service_phone" placeholder="填写格式：0758XXXXX" />
					</view>
					<!-- 经营场景 -->
					<block>
						<view class="uni-form-item">
							<view class="title">门店名称</view>
							<input class="uni-input" v-model="form.biz_store_name" placeholder="填写格式：大郎烧饼" />
						</view>
						<view class="uni-form-item">
							<view class="title">门店省市</view>

							<pick-regions :defaultRegion="form.biz_address_code" @getRegion="handleGetRegion">
								<input class="uni-input" disabled :placeholder="regionName?regionName:'输入地址'" />
							</pick-regions>
						</view>
						<view class="uni-form-item">
							<view class="title">门店地址</view>
							<input class="uni-input" v-model="form.biz_store_address"
								placeholder="填写格式：南山区xx大厦x层xxxx室" />
						</view>
						<view class="uni-form-item">
							<view class="title">门店门头照片</view>
							<view class="form-item">
								<view class="item">
									<text class="item-add" @click="ChooseImage('store_entrance_pic')"
										v-if="!form.store_entrance_pic">+</text>
									<image class="img" :src="form.store_entrance_pic_url" mode="aspectFill"
										@tap="ViewImage('store_entrance_pic')" v-if="form.store_entrance_pic"></image>
									<text class="delete-btn" @click="DeleteImage('store_entrance_pic')"
										v-if="form.store_entrance_pic">X</text>

									<text class='label' style="height: 10px;"></text>
								</view>
							</view>
						</view>
						<view class="uni-form-item">
							<view class="title">店内环境照片</view>
							<view class="form-item">
								<view class="item">
									<text class="item-add" @click="ChooseImage('indoor_pic')"
										v-if="!form.indoor_pic">+</text>
									<image class="img" :src="form.indoor_pic_url" mode="aspectFill"
										@tap="ViewImage('indoor_pic')" v-if="form.indoor_pic"></image>
									<text class="delete-btn" @click="DeleteImage('indoor_pic')"
										v-if="form.indoor_pic">X</text>

									<text class='label' style="height: 10px;"></text>
								</view>
							</view>
						</view>
					</block>
					<!-- 结算规则 -->
					<uni-section title="结算规则" type="line"></uni-section>
					<view class="uni-form-item">
						<view class="title">所属行业</view>
						<picker @change="pickerChange($event,'qualification_type')" :value="qualification_type_index"
							:range="qualification_type[form.subject_type]" range-key="value">
							<view class="uni-input">
								{{qualification_type[form.subject_type][qualification_type_index].value}}
							</view>
						</picker>
					</view>

					<view class="uni-form-item">
						<view class="title">优惠费率活动值</view>
						<input class="uni-input" v-model="form.activities_rate" placeholder="填写：0.6" />
					</view>
					<!-- 收款银行卡信息 -->
					<uni-section title="收款银行卡信息" type="line"></uni-section>
					<view class="uni-form-item">
						<view class="title">收款银行卡</view>
						<view class="form-item">
							<view class="item">
								<text class="item-add" @click="ChooseImage('bank_pic')" v-if="!form.bank_pic">+</text>
								<image class="img" :src="form.bank_pic_url" mode="aspectFill"
									@tap="ViewImage('bank_pic')" v-if="form.bank_pic"></image>
								<text class="delete-btn" @click="DeleteImage('bank_pic')" v-if="form.bank_pic">X</text>

								<text class='label' style="height: 10px;"></text>
							</view>
						</view>
					</view>
					<view class="uni-form-item">
						<view class="title">开户名称</view>
						<input class="uni-input" v-model="form.account_name" placeholder="请输入开户名称" />
					</view>
					<view class="uni-form-item">
						<view class="title">开户银行</view>
						<picker @change="pickerChange($event,'account_bank')" :value="account_bank_index"
							:range="account_bank" range-key="value">
							<view class="uni-input">{{account_bank[account_bank_index].value}}</view>
						</picker>
					</view>
					<view class="uni-form-item">
						<view class="title">开户银行省市</view>
						<pick-regions :defaultRegion="form.bank_address_code" @getRegion="handleGetRegions">
							<input class="uni-input" disabled :placeholder="regionNames?regionNames:'输入地址'" />
						</pick-regions>
					</view>
					<view class="uni-form-item">
						<view class="title">银行卡详细支行</view>
						<input class="uni-input" v-model="bank_seach" @input="bankSeach"
							placeholder="请输入银行全称＋支行名称,点击下方进行选择">
					</view>
					<view style="display:none" class="uni-form-item" v-if="bank_branch_id">
						<picker @change="pickerChange($event,'bank_branch_id')" :value="bank_branch_id_index"
							:range="bank_branch_id" range-key="name">
							<button type="primary">{{bank_branch_id[bank_branch_id_index].name}}</button>
						</picker>
					</view>
					<view class="uni-form-item">
						<view class="title">银行账号</view>
						<input class="uni-input" v-model="form.account_number" placeholder="请输入银行账号" />
					</view>
				</block>


				<button class="button" type="primary" form-type="submit" :loading="loading">提交</button>

			</form>

		</view>

		<view v-else-if="form.status=='APPLYMENT_STATE_TO_BE_SIGNED'">
			<view class="qrcode">
				<view class="text">扫码签约</view>
				<image :src="form.sign_url" style="height:300px;width:300px;">
			</view>
		</view>
		<view v-else>
			<view class="apply-view">进件成功</view>
		</view>
	</view>
</template>

<script>
	import uniSection from '@/components/uni-section/uni-section.vue'
	import pickRegions from '@/components/pick-regions/pick-regions.vue'
	import {
		upload
	} from "@/common/upload.js";
	import merchant from '@/api/merchant'
	export default {
		data() {
			return {
				uid: 0,
				src: "",
				objType: {
					1: '小微商户进件',
					2: '普通商户进件'
				},
				type: 1,
				error: {
					card_period_end: '',
					card_period_start: ''
				},
				form: {
					province: '',
					city: "",
					area: "",
					contact_type: '',
					contact_name: '',
					contact_id_doc_copy: '',
					contact_id_doc_copy_back: '',
					business_authorization_letter: '',
					subject_type: 'SUBJECT_TYPE_INDIVIDUAL',
					license_copy: '',
					organization_copy: '',
					id_doc_type: '',
					id_card_copy: '',
					id_card_national: '',
					store_entrance_pic: '',
					indoor_pic: '',
					biz_address_code: '110101',
					bank_address_code: '110102',
					web_authorisation: '',
					sales_scenes_type: '',
					id_card_address: '',
					bank_address_city: '',
					biz_address_city: '',
					account_bank_index: 0,
					subject_type_index: 0
				},
				region: '',
				regions: '',
				bank_seach: '',
				id_doc_type: [{
					'name': ''
				}],
				id_doc_type_index: 0,
				contact_id_doc_type_index: 0,
				account_bank: [{
					'value': ''
				}],
				account_bank_index: 0,
				bank_account_type: {},
				bank_account_type_index: 0,
				qualification_type: {
					SUBJECT_TYPE_INDIVIDUAL: [{
						'value': ''
					}]
				},
				qualification_type_index: 0,
				subject_type: [{
					'name': ''
				}, {
					'name': ''
				}],
				subject_type_index: 0,
				bank_branch_id: [{
					'name': ''
				}],
				bank_branch_id_index: 0,
				loading: false,

				download_url: '', // 文件下载链接
				authorization_letter_url: '', // 业务办理授权函
				targetBank: '',
				selected_bank_value: '',
				selected_qualification_type: '',
				current_bank_id: null,
				biz_address_city: '',
				bank_address_city: "",
				selected_subject_type: '',
				userRealBank: ''
			};
		},
		components: {
			pickRegions
		},
		// 组件加载时执行
		watch: {
			// 监听 selected_bank_value 的变化
			selected_bank_value(newValue) {
				// alert(newValue)
				if (newValue) {
					console.log("selected_bank_value 设置成功:", newValue);
					this.setDefaultBank(); // 监听到值变化后重新匹配索引
				}
			},
			selected_qualification_type(newValue) {
				// alert(newValue)
				if (newValue) {
					console.log("selected_qualification_type 设置成功:", newValue);
					this.setDefaultQualificationType(); // 监听到值变化后重新匹配索引
				}
			}
		},
		computed: {
			regionName() {
				// 判断是否为数组并处理

				if (Array.isArray(this.region)) {
					return this.region.map(item => item.name).join(' '); // 数组处理
				} else {
					return String(this.region); // 非数组处理，转为字符串
				}
			},
			regionNames() {
				// 判断是否为数组并处理

				if (Array.isArray(this.regions)) {
					return this.regions.map(item => item.name).join(' '); // 数组处理
				} else {
					return String(this.regions); // 非数组处理，转为字符串
				}
			},
			getMatchingBankIndex() {
				// 去掉 "中国" 字符后的目标银行名称
				const sanitizedTarget = this.targetBank.replace("中国", "");
				// 查找匹配的银行所在的索引
				return this.account_bank.findIndex((bank) => bank.value.replace("中国", "") === sanitizedTarget);
			},
		},
		onShow() {
			console.log("onShow 页面显示, bank_id:", this.current_bank_id);

			// 先清空值，强制触发 watch
			this.selected_bank_value = "";
			this.selected_qualification_type = "";

			if (this.current_bank_id) {
				this.getDetail(this.current_bank_id);
			}
		},
		onLoad(opts) {
			uni.setNavigationBarTitle({
				title: opts.type ? this.objType[opts.type] : '商户进件'
			})
			this.type = opts.type ?? 1;
			if (this.type == 1) {
				this.subject_type_index = 0;
			}
			this.getApplyConfig();
			if (opts.uid) {
				this.form.uid = opts.uid;
				this.uid = opts.uid;
			}
			// 先清空值，强制触发 watch
			this.selected_bank_value = "";
			this.selected_qualification_type = '';
			// this.selected_bank_value = '工商银行'
			if (opts.id) { // 获取编辑数据
				this.current_bank_id = opts.id;
				// this.getDetail(opts.id);
			}
		},
		methods: {
			// 初始化时，确保 qualification_type_index 指向正确值
			setDefaultQualificationType() {
				const index = this.qualification_type[this.selected_subject_type].findIndex(item => item.value === this
					.selected_qualification_type);
				this.qualification_type_index = index !== -1 ? index : 0;
				this.form.qualification_type_index = index;
				console.log("qualification_type 设置成功:", this.qualification_type_index)
			},
			// 设置默认选中的银行
			setDefaultBank() {
				// alert(this.selected_bank_value)
				const index = this.account_bank.findIndex(bank => bank.value === this.userRealBank);
				// alert(index)
				if (index !== -1) {
					console.log("selected_bank_value 设置成功:", index);

					this.account_bank_index = index;
					this.form.account_bank_index = index;
				}
			},
			DeleteImage(field) {
				this.form[field] = '';
				this.form[field + '_url'] = '';
			},
			getDetail(id) {
				merchant.detail({
					'id': id
				}).then(res => {
					if (res.code === 1) {
						this.form = res.data;
						this.userRealBank = res.data.account_bank;
						this.region = res.data.biz_address_city ? res.data.biz_address_city : '';
						this.regions = res.data.bank_address_city ? res.data.bank_address_city : '';
						// this.biz_address_arr;
						this.bank_branch_id_index = 0;
						this.bank_branch_id[0].name = res.data.bank_branch_name;
						this.bank_branch_id[0].value = res.data.bank_branch_id;
						this.selected_bank_value = res.data.account_bank;
						this.selected_qualification_type = res.data.qualification_type
						this.selected_subject_type = res.data.subject_type;
						this.account_bank_index = res.data.account_bank_index
						this.subject_type_index = res.data.subject_type_index
						this.qualification_type_index = res.data.qualification_type_index
						// this.setDefaultBank()
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			getApplyConfig() {
				merchant.applyConfig().then(res => {
					if (res.code === 1) {
						this.account_bank = res.data.account_bank;
						this.bank_account_type = res.data.bank_account_type;
						this.subject_type = res.data.subject_type;
						this.qualification_type = res.data.category;
						// this.sales_scenes_type = res.data.sales_scenes_type;
						// this.contact_type = res.data.contact_type;
						this.id_doc_type = res.data.id_doc_type;

						this.form.contact_id_doc_type = this.id_doc_type[this.contact_id_doc_type_index].value;
						// this.form.contact_type = this.contact_type[this.contact_type_index].value;
						// this.form.sales_scenes_type = this.sales_scenes_type[this.sales_scenes_type_index].value;
						this.form.account_bank = this.account_bank[this.account_bank_index].value;
						this.form.subject_type = this.subject_type[this.subject_type_index].value;
						this.form.qualification_type = this.qualification_type[this.form.subject_type][this
							.qualification_type_index
						].value;
						this.form.qualification_type_id = this.qualification_type[this.form.subject_type][this
							.qualification_type_index
						].settlementID;

						// this.micro_biz_type = res.data.micro_biz_type;
						// this.form.micro_biz_type = this.micro_biz_type[this.micro_biz_type_index].value;


						this.download_url = res.data.download_url;
						this.authorization_letter_url = res.data.authorization_letter_url;
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			// 获取选择的地区
			handleGetRegion(region) {
				console.log('获取到的省市区信息1:', region); // 输出返回的值
				this.region = region;
				this.form.biz_address_code = region[2]['code']
				this.form.biz_address_city = region[0]['name'] + region[1]['name'] + region[2]['name']
				this.form.province = region[0]['name']
				this.form.city = region[1]['name']
				this.form.area = region[2]['name']
				// alert(this.form.biz_address_city)
			},
			// 获取选择的地区
			handleGetRegions(region) {
				console.log(region)
				this.regions = region;
				this.form.bank_address_code = region[2]['code']
				this.form.bank_address_city = region[0]['name'] + region[1]['name'] + region[2]['name']
				// alert(this.regions)
				// alert(this.form.bank_address_city)
			},
			pickerChange(e, name) {
				// alert(e.detail.value)
				this[name + '_index'] = e.detail.value
				// alert(this.form[name])
				if (name == "qualification_type") {
					console.log(this[name][this.form.subject_type][this[name + '_index']]);
					this.form[name] = this[name][this.form.subject_type][this[name + '_index']].value;
					this.form[name + '_id'] = this[name][this.form.subject_type][this[name + '_index']].settlementID;
					this.form.qualification_type_index = e.detail.value
				} else {
					this.form[name] = this[name][this[name + '_index']].value;

					if (name == "subject_type") {
						this.form.subject_type_index = e.detail.value
						this.qualification_type_index = 0;
						this.form.qualification_type = this.qualification_type[this.form[name]][this
							.qualification_type_index
						].value;
						this.form.qualification_type_id = this.qualification_type[this.form[name]][this
							.qualification_type_index
						].settlementID;
					}
					if (name == 'account_bank') {
						this.form.account_bank_index = e.detail.value
					}
				}
			},
			bankSeach(e) {
				merchant.getBankConfig({
					name: e.detail.value
				}).then(res => {
					if (res.code === 1) {
						this.bank_branch_id = res.data
						this.form.bank_branch_id = this.bank_branch_id[this.bank_branch_id_index].value;
					}
				})
			},
			isValidDate(dateString) {
				const regex = /^\d{4}-\d{2}-\d{2}$/;

				if (!regex.test(dateString)) {
					return false; // 格式不符合
				}

				const [year, month, day] = dateString.split('-').map(Number);

				// 检查月份范围
				if (month < 1 || month > 12) {
					return false;
				}

				// 检查日期范围
				const daysInMonth = new Date(year, month, 0).getDate();
				if (day < 1 || day > daysInMonth) {
					return false;
				}

				return true; // 日期格式和有效性均符合
			},
			checkcard_begin() {
				if (!this.isValidDate(this.form.card_period_begin)) {
					console.log('日期格式或有效性不符合要求');
					this.error.card_period_begin = '日期格式或有效性不符合要求'
				} else {
					this.error.card_period_begin = '';
				}
			},
			checkcard_end() {
				if (!this.isValidDate(this.form.card_period_end) && this.form.card_period_end !== '长期') {
					console.log('日期格式或有效性不符合要求');
					this.error.card_period_end = '日期格式或有效性不符合要求'
				} else {
					this.error.card_period_end = '';
				}
			},
			formSubmit() {
				// if (this.loading) return; // 防止重复点击
				this.loading = true;
				// alert(this.form.bank_address_city)
				merchant.apply(this.form).then(res => {
					if (res.code == 1) {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})

						setTimeout(function() {
							uni.navigateTo({
								url: '/pages/my/index'
							})
						}, 1000);
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
					this.loading = false;
				})
			},
			ChooseImage(image_type) {
				let that = this
				if (this.loading) {
					return;
				}
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: (chooseRes) => {
						upload(chooseRes.tempFilePaths[0]).then(res => {
							this.form[image_type + '_url'] = res.fullurl
							this.form[image_type] = res.url;

							if (image_type == 'license_copy') {
								that.getOcr(res.fullurl, 'RecognizeBusinessLicense')
							}

							if (image_type == 'id_card_copy') {
								that.getOcrcard(res.fullurl, 'RecognizeIdcard')
							}

							if (image_type == "id_card_national") {
								that.getOcrnational(res.fullurl, 'RecognizeIdcard')
							}

							if (image_type == 'bank_pic') {
								that.getOcrbank(res.fullurl, 'RecognizeBankCard')
							}
							// console.log(this.form)
						})
					}
				});
			},
			getOcr(url, action) {
				let that = this
				merchant.ocr_url({
					fileName: url,
					action: action
				}).then(res => {
					if (res.code == 1) {
						console.log(res.data.creditCode)

						if (res.data.companyType == '个体经营') {
							that.subject_type_index = 0;
						} else {
							that.subject_type_index = 1;
						}

						that.$set(that.form, 'license_number', res.data.creditCode);
						that.$set(that.form, 'merchant_name', res.data.companyName);
						that.$set(that.form, 'legal_person', res.data.legalPerson);
						that.$set(that.form, 'biz_store_address', res.data.businessAddress);
						that.$set(that.form, 'biz_store_name', res.data.companyName);
						that.$set(that.form, 'merchant_shortname', res.data.companyName);
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			getOcrbank(url, action) {
				let that = this
				merchant.ocr_url({
					fileName: url,
					action: action
				}).then(res => {
					if (res.code == 1) {
						console.log(res.data)
						that.targetBank = res.data.bankName;
						const matchingIndex = that.getMatchingBankIndex;
						if (matchingIndex !== -1) {
							that.account_bank_index = matchingIndex
							that.form.account_bank_index = matchingIndex
							console.log(`匹配的银行索引是: ${matchingIndex}`);
						} else {
							console.log("未找到匹配的银行");
						}

						that.$set(that.form, 'account_number', res.data.cardNumber);
						// birthDate
						console.log(that.form)
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			getOcrnational(url, action) {
				let that = this
				merchant.ocr_url({
					fileName: url,
					action: action
				}).then(res => {
					if (res.code == 1) {
						console.log(res.data.back.data)
						let validPeriod = res.data.back.data.validPeriod;
						let dates = validPeriod.split(/[\s\-]+/);
						that.$set(that.form, 'card_period_begin', dates[0].replace(/\./g, '-'));
						that.$set(that.form, 'card_period_end', dates[1].replace(/\./g, '-'));
						// birthDate
						console.log(that.form)
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			getOcrcard(url, action) {
				let that = this
				merchant.ocr_url({
					fileName: url,
					action: action
				}).then(res => {
					if (res.code == 1) {
						console.log(res.data.face.data)

						that.$set(that.form, 'id_card_address', res.data.face.data.address);
						that.$set(that.form, 'id_card_number', res.data.face.data.idNumber);
						that.$set(that.form, 'id_card_name', res.data.face.data.name);
						that.$set(that.form, 'account_name', res.data.face.data.name);

					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			ChooseImages(type, number = 2) {
				let that = this;
				if (that.loading) {
					return;
				}
				uni.chooseImage({
					count: number, //默认9
					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: (chooseRes) => {
						chooseRes.tempFilePaths.forEach((item, index) => { //js遍历数组
							upload(item).then(res => {
								that.form[type + '_url'].push(res.fullurl);
								that.form[type].push(res.url);
							})
						});
					}
				});
			},
			CancleImage(type, index) {
				let that = this;
				that.form[type].splice(index, 1);
				that.form[type + '_url'].splice(index, 1);
			},
			ViewImage(type) {
				const imgs = [];
				imgs.push(this.form[type + '_url']);
				uni.previewImage({
					urls: imgs,
					current: 0
				});
			},
			DownFile(url) {
				// 下载文件
				uni.downloadFile({
					url: url,
					success: (res) => {
						if (res.statusCode === 200) {
							uni.showToast({
								title: '下载成功',
								icon: 'none'
							})
						}
					}
				});
			},
			Goto(url) {
				console.log(url)
				// let url = 'http://xxxxxx/routerApp'  // URL是要跳转的外部地址 作为参数
				uni.navigateTo({
					url: '/pages/common/webview?url=' + url
					// page.json定义的路径 传url 到webview界面去接收 实现跳转
				})
			},
		}
	}
</script>

<style lang="scss">
	.delete-btn {
		position: absolute;
		top: 0;
		right: 0;
		background: rgba(0, 0, 0, 0.5);
		color: white;
		padding: 2px 5px;
		font-size: 14px;
		border-radius: 50%;
		cursor: pointer;
	}

	.qrcode {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin-top: 20%;

		.text {
			margin-bottom: 20px;
			font-size: 25px;
		}

		image {
			width: 300px;
			height: 300px;
		}
	}

	.apply-view {
		background-color: #fff;
		padding: 20rpx 30rpx;

		.info {
			color: red;
		}

		.uni-form-item {
			border-bottom: 2rpx solid #DFDFDF;
			margin-bottom: 20rpx;

			.title {
				color: #333;
				font-size: 28rpx;

				.down_tips {
					color: #007bff;
				}
			}

			.uni-input {
				font-size: 30rpx;
				padding: 10rpx 0;
				height: 40px;
			}
		}

		.button {
			margin-top: 40rpx;
		}

		.form-item {
			display: flex;
			padding-bottom: 20rpx;
			margin-top: 20rpx;

			.item {
				flex: 1;
				position: relative;

				.img {
					width: 100%;
					height: 200rpx;
				}

				.item-add {
					display: inline-block;
					width: 100%;
				}
			}

			.item-add {
				display: inline-block;
				border: 1px solid #ddd;
				text-align: center;
				height: 200rpx;
				line-height: 200rpx;
				font-size: 100rpx;
				color: #999;
			}

			.item:first-child {
				padding-right: 10rpx;
			}

			.item:last-child {
				padding-left: 10rpx;
			}

			.item-images {
				flex: 1;
				display: flex;
				flex-wrap: wrap;

				.img {
					position: relative;

					image {
						width: 200rpx;
						height: 200rpx;
						margin-right: 20rpx;
						margin-top: 20rpx;
					}

					.item-del {
						position: absolute;
						top: 0;
						right: 10rpx;
						z-index: 1;
						width: 40rpx;
						height: 40rpx;
						background: #fff;
						border-radius: 50%;
						border: 1rpx solid #dfdfdf;
						display: flex;
						align-items: center;
						justify-content: center;
						color: #f00;
					}
				}

				.item-add {
					display: inline-block;
					width: 200rpx;
					margin-top: 20rpx;
				}
			}
		}
	}
</style>